<template>
	<view class="main">
		<view v-if="user">
			<view class="myinfo_box">
				<view class="myinfos "></view>
				<view class="myinfox "></view>
				<view class="myinfo bg_f">
					<view class="mytop">
						<view class="avatar">
							<image :src="user.avatar" @click="opavatar"></image>
						</view>
						<view class="avatarr">
							<view class="username">
								<view class="fw name">{{user.username}}</view>
								<view class="id">ID : {{user.user_id}}</view>
							</view>
							<view class="usernamer">
								<view class="qd">
									签到
								</view>
							</view>
						</view>
					</view>
					<view class="mytopx">
						<navigator url="credit">
							<view class="myji1">
								我的积分
							</view>
						</navigator>
						<navigator url="credit">
							<view class="myji1">
								我的会员
							</view>
						</navigator>
					</view>
				</view>
			</view>
			<view class="h_box"></view>
			<view class="box">
				<view class="bg_f menu_list_a">
					<navigator url="article/article">
						<view class="box_li myli" >
							<view>
								<icon class="uni app-kefu mr20"></icon>我的文章
							</view>
							<icon class=" uni app-qianjin2"></icon>
						</view>
					</navigator>
					
					<navigator url="article/form">
						<view class="box_li myli" >
							<view>
								<icon class="uni app-kefu mr20"></icon>发布文章
							</view>
							<icon class=" uni app-qianjin2"></icon>
						</view>
					</navigator>
					
				</view>
			</view>
			
			<view class="box">
				<view class="bg_f menu_list_a">
					<navigator url="article/article">
						<view class="box_li myli" >
							<view>
								<icon class="uni app-kefu mr20"></icon>帮助中心
							</view>
							<icon class=" uni app-qianjin2"></icon>
						</view>
					</navigator>
					
					<navigator url="set/set">
						<view class="box_li myli" >
							<view>
								<icon class="uni app-shezhi mr20"></icon>设置
							</view>
							<icon class=" uni app-qianjin2"></icon>
						</view>
					</navigator>
					
				</view>
			</view>
			
			
		</view>
		<view v-else>
			<view class="myform">
				<view class="bt">
					账号登录
				</view>
				<form @submit="loginSubmit" class="">
					<view class="myinput btx">
						<input class="uni-input dhuis_b" v-model="form.phone" @input="checkform" name="phone" placeholder="手机号/账号" />
					</view>
					<view class="myinput">
						<input class="uni-input dhuis_b" v-model="form.password" @input="checkform" password="true" name="password" placeholder="密码" />
					</view>
					<view class="btn">
						<button form-type="submit" :disabled="disabled" class="mybtn" :class="{mhs_bg_active:!disabled,wjh_btn:disabled}">登录</button>
						
					</view>
				</form>
				<view class="reg_forget">
					<navigator url="smslogin">
						<view class="" >
							短信登录
						</view>
					</navigator>
					<navigator url="forget">
						<view class="" >
							忘记密码?
						</view>
					</navigator>
				</view>
			</view>
			
			<!-- #ifndef H5 -->
			<view class="other_login">
				<view class="bt">
					其他登录方式
				</view>
				<view class="item_flex">
					<!-- #ifdef APP-PLUS -->
					<view class="item" data-logintype="weixin" @click="appLogin">
						<image src="/static/img/wx.png"></image>
					</view>
					<view class="item" data-logintype="qq" @click="appLogin">
						<image src="/static/img/qq.png"></image>
					</view>
					<!-- #endif -->
					<!-- #ifdef MP-WEIXIN -->
					<button class="item" @click="wxLogin">
						<image src="/static/img/wx.png"></image>
					</button>
					<view class="item" data-logintype="qq" @click="appLogin">
						<image src="/static/img/qq.png"></image>
					</view>
					<!-- #endif -->
				</view>
			</view>
			<!-- #endif -->
		</view>
		
	</view>
</template>

<script>
	import alist from '../../components/alist.vue';
	export default {
		data() {
			return {
				user:false,
				sex:5,
				form:{phone:'',password:''},
				disabled:true,
			}
		},
		methods: {
			checkform(){
				if(!(this.func.empty(this.form.password)) && !(this.func.empty(this.form.phone))){
					if(this.func.is_phone(this.form.phone)){
						this.disabled=false;
					}else{
						this.disabled=true;
					}
				}else{
					this.disabled=true;
				}
			},
			loginSubmit: function(e) {
				var formdata = e.detail.value;
				this.api.request({url:'/api/v1/user/login',method:'POST',formdata:formdata,
				}).then(res=>{
					//console.log(res);
					if(res.code==631){
						this.user = this.api.login(res.data);
					}
					uni.showToast({
						title:res.msg,
						duration: 1000,
						icon: "none"
					})
				});
			},
			wxLogin(){
				uni.getUserProfile({
					desc:'微信登录',
					success:(e)=>{
						uni.login({
							provider: 'weixin',
							success: (loginRes)=>{
								var formdata=e.userInfo;
								formdata.code = loginRes.code;
								this.api.request({url:'/api/common/uni/min',method:'POST',formdata:formdata
								}).then(res=>{
									if(res.code==10021){
										this.user = this.api.login(res.data);
									}
									uni.showToast({
										title:res.msg,
										duration: 1000,
										icon: "none"
									})
								});
							}
						});
					}
				});
			},
			appLogin(e){
				var logintype = e.currentTarget.dataset.logintype;
				uni.login({
					provider: logintype,
					success: ()=>{
						uni.getUserInfo({
							provider: logintype,
							success: (appres)=>{
								console.log(appres);
								var formdata={};
								formdata.logintype = logintype;
								if (logintype == "weixin") {
									formdata.avatarUrl = appres.userInfo.avatarUrl;
									formdata.nickname = appres.userInfo.nickName;
									formdata.openid = appres.userInfo.openId;
									formdata.unionid = appres.userInfo.unionId;
								} else if (logintype == "qq") {
									formdata.avatarUrl = appres.userInfo.figureurl_qq_2;
									formdata.openid = appres.userInfo.openId;
									formdata.nickname = appres.userInfo.nickname;
									formdata.unionid = appres.userInfo.unionid;
								}
								this.api.request({url:'/api/common/uni/app',method:'POST',formdata:formdata
								}).then(res=>{
									console.log(res);
									if(res.code==10021){
										this.user = this.api.login(res.data);
									}
									uni.showToast({
										title:res.msg,
										duration: 1000,
										icon: "none"
									})
								});
							}
						});
					}
				});
			},
			opavatar(){
				uni.showActionSheet({
				    itemList: ['查看头像', '相册上传'],
				    success: (res)=>{
						if(res.tapIndex==0){
							uni.previewImage({
								urls: this.user.avatar,
								longPressActions: {
									itemList: ['保存图片', '收藏'],
									success: function(data) {
										console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
									},
									fail: function(err) {
										console.log(err.errMsg);
									}
								}
							});
						}else if(res.tapIndex==1){	
							uni.chooseImage({
							    count: 1,
							    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
							    sourceType: ['album','camera'], //从相册选择
							    success: (res)=>{
									var tempfile= res.tempFilePaths[0];
							        //console.log(JSON.stringify(res.tempFilePaths));
									uni.navigateTo({
										url:'./avatar?tempfile=' + tempfile,
									})
							    }
							});
						}else{
							
						}
				    }
				});
			},
			baidu(){
				this.api.webUrl('https://www.baidu.com');
			}
			
		},
		onLoad() {
			console.log('onLoad');
		},
		onReady(){
			console.log('onReady');
		},
		onShow(){
			this.user = this.api.getuser();
			console.log('onShow');
		},
		onHide(){
			console.log('onHide');
		},
		onUnload(){
			console.log('onUnload');
		},
		components:{
			alist
		}
	}
</script>

<style>
@import url("my.css");
page{background: #FFFFFF;}
</style>
